@charset "utf-8";
/* 
    ProjectName：电信征文
    Developer：佛哥
    Data:2018-12-18
 */
html,body{
    background: #E5E5E5;
}
body{
    &.lock{
        overflow: hidden!important;
    }
}
 #page{
    width: 100%;
    max-width: 1920px;
    min-width: 320px;
    overflow: hidden;
    background: #FFF;
     
    -webkit-box-shadow: 0px 10px 10px 0px rgba(184,184,184,1);
    -moz-box-shadow: 0px 10px 10px 0px rgba(184,184,184,1);
    box-shadow: 0px 10px 10px 0px rgba(184,184,184,1);
    
    margin: auto;
    font-family: arial,"Microsoft YaHei","\5fae\8f6f\96c5\9ed1";
    line-height: 1.5;
   
    padding-top:80px;
    &.hasbg{
        background: #a5161a url(../images/body_bg2.jpg) no-repeat center 0px;
        min-height: 1700px;
    }
 }
 .inner-box{
    height: 100%;
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}
//头部
 .header{
    height: 80px;
    box-sizing: border-box;
    border-bottom: 1px solid #e8e7ed;
    background: #fff;
    position: fixed;
    width: 100%;
    max-width: 1920px;
    z-index: 10;
    
    top:0;
    //logo
    .logo{
        float: left;
        margin:16px 0 0 10px;
        h1{
            width: 118px; 
            height: 48px; 
            background: url(../images/logo.png) no-repeat;
            background-size:118px 48px; 
            
            display: inline-block;
            vertical-align: middle;     
            margin-right: 24px;    
            a{
                display: block;
                height: 48px;
                text-indent: -999em;
            }
        }
        a{
            display: inline-block;
            vertical-align: middle;
            font-size: 20px;
            font-weight: bold;
            color: #00439f;
        }
    }
    //用户信息
    .user-info{
        position: absolute;
        right: 10px;
        top:0;
        line-height: 80px;  
        display: none;
        span{
            font-size: 16px;
            display: inline-block;
            vertical-align: middle;
            padding-right: 12px;
        }
        a{
            font-size: 20px;
            font-weight: bold;
            color: #00439f;
            display: inline-block;
            vertical-align: middle;
            padding-left: 12px;
            &.loginOut::before{
                position: absolute;
                content: '';
                display: inline-block;
                width: 1px;
                height: 18px;
                left: 0;
                top:50%;
                transform: translateY(-50%);
                background: #ddd;
            }
            &:hover{
                color: red;
            }
        } 
    }
 }

 //首页瀑布流
 .zhanweifu{
     display: none;
 }

 //评选结果
 .pingxuan_res1box{
     width: 100%;
     max-width: 850px;
     padding:0 20px;
     margin:630px auto 0;
     color: #eae68b;
     box-sizing: border-box;
    //  line-height: 40px;
     h3{
         font-size: 24px;
         font-weight: normal;
         font-family: '微软雅黑';
         text-align: center;
         line-height: 40px;
         margin-bottom: 15px;
     }
     p{
         text-align: center;
         font-size: 16px;
     }
     dl{
         dt{
             font-size: 16px;
             font-weight: normal;
             font-family: '微软雅黑';
             margin-top:10px;
             line-height: 30px;
         }
         dd{
             margin-left: 56px;
             line-height: 1.8;
             margin-bottom: 10px;
             .big{
                 font-size:18px;
                 font-weight: bold; 
             }
         }
     }

     


 }
.pingxuan_res2box{
    max-width: 1182px;
    width: 100%;
    margin:15px auto 0;
    padding:0 20px;
    color: #eae68b;
    box-sizing: border-box;

    .pingxuanTitle{
        width: 100%;
        max-width: 750px;
        margin-left: auto;
        margin-right: auto;
        height: 100px;
        line-height: 100px;
        font-weight: normal;
        font-size: 24px;
        text-align: center;
        position: relative;
        span{
            position: absolute;
            top:50%;
            transform: translateY(-50%);
            right: 0px;
            font-size: 16px;
            cursor: pointer;
            i{
                transition: .3s all;
                display: inline-block;
            }
        }

        &.open{
            span{
                i{
                    transform: rotate(180deg);
                }
            }
        }
    }
    .listshow{
        margin-bottom: 90px;
        // display: none;
    }
    .px_title{
        border-top:1px solid #eae68b;
        border-bottom:1px solid #eae68b;
        height: 100px;
        table{
            width: 100%;
            max-width: 760px;
            text-align: center;
            margin:0 auto;
            td{
                width: 20%;
                height: 100px;
                text-align: center;
            }
        }
    }

    .px_cont{
        padding-top:16px;
        table{
            width: 100%;
            max-width: 760px;
            text-align: center;
            margin:0 auto;
            td{
                width: 20%;
                height: 42px;
            }
        }
    }

}

.pingxuan_res3box{
    max-width: 850px;
    width: 100%;
    margin:10px auto 0;
    padding:0 20px;
    color: #eae68b;
    box-sizing: border-box;

    h3{
        font-size: 24px;
        font-weight: normal;
        font-family: '微软雅黑';
        text-align: center;
        line-height: 40px;
        margin-bottom: 15px;
    }
    dl{
        dt{
            font-size: 16px;
            font-weight: normal;
            font-family: '微软雅黑';
            margin-top:10px;
            line-height: 40px;
        }
        dd{
            margin-left: 32px;
            line-height: 36px;
    
            &.white{
                color: #fff;
            }
        }
    }
}


 //评选规则
 .rulebox{
     width: 850px;
     box-sizing: border-box;
     
     margin:90px auto 0;
     color: #e5d373;
     box-sizing: border-box;
     padding-left: 105px;
     position: relative;
      
     border-radius: 5px;
     padding:10px 20px 0 105px;
     
     .ruletitle{
         font-weight: bold;
         font-size: 18px;
         line-height: 1.6;
         position: absolute;
         top:10px;
         left: 0;
     }
     .ruleContent{
        font-size: 16px;
        line-height: 1.6;
        overflow:visible;
        
        p{
            margin-bottom: 15px;
            text-align: justify;
            text-indent: -15px;
            .lookmore,.lookless{
                color: #fff;
                cursor: pointer;
                margin-left: 10px;   
            }         
            i{
                display: inline-block;
                width: 20px;
                height: 20px;
                text-align: center;
                line-height: 20px;
                margin-left: 5px;
                font-size: 0;
                text-indent: 0;
                text-shadow: 0 0 1px #333;
                &::before{
                    display:block;
                    font-size: 16px;

                }
                &.up{
                    transform:rotate(180deg);
                    -ms-transform:rotate(180deg); 	/* IE 9 */
                    -moz-transform:rotate(180deg); 	/* Firefox */
                    -webkit-transform:rotate(180deg); /* Safari 和 Chrome */
                    -o-transform:rotate(180deg); 	/* Opera */
                }
            }
            
        }

        .lookmore{
            display: none;
        }
        .lookless{
            display: inline-block;   
        }
        

        &.limit{
            overflow: hidden;
            p + p{
                display: none;
            }
            .lookmore{
                display: inline-block;
            }
            .lookless{
                display: none;   
            }
           
        }
     }  
     
 }

 //首页内容
 .content{
     max-width: 1180px;
     min-width: 320px;
     box-sizing: border-box;
     width: 100%;
     margin-left: auto;
     margin-right: auto;
     margin-top: 80px;
     padding: 0px 0;
     

     .itme-bottom{
         padding:12px;
         background: #fff;
         h3{ min-height: 22px; max-height: 44px; overflow: hidden; line-height: 22px; color: #050505; font-weight: normal; font-size: 16px;
            a{
                color: #050505;       
            }
            a:hover{
                color: #c40000;
            }
        }
         p{  height: 22px; line-height: 22px; color: #999999; font-size: 14px;margin:4px 0 0 0!important;
            .authorId{
                color: #c40000;
            }
            span{
                float: right;
                color: #c40000;
            }
        }
         button{
             display: block;
             width: 100%;
             margin-top:11px;            
             cursor: pointer;
             height: 36px;
             line-height: 36px;
             border:none;
             color: #fff;
             border-radius: 3px;
             font-size: 16px;
             background: #ccc;            
             &.voted{
                 background: #999;
                 color: #eee;
             }
         }
     }

     .loading{
        position: fixed;
        bottom:0;
        height: 25px;
        line-height: 25px;        
        left: 50%;
        transform: translateX(-50%);
        display: none;

    }
 }

 //详情页
 .detailContent{
     max-width: 1180px;
     min-height: 650px;
     margin-left: auto;
     margin-right: auto;
     margin-top:25px;
     padding-bottom: 100px;
     position: relative;
     .detailTitle{
        h2{ 
            line-height: 42px; 
            overflow: hidden;
            font-size: 28px;
            font-weight: bold;
            
            a{
                color:#9f0101;
            }
        

        }
        p{
            margin-top:8px;
            height: 36px;
            line-height: 36px;
            font-size: 16px;
            color: #b3b3b3;
            
            span{
                margin-left: 25px;
                i{}
                &:nth-child(2){
                    margin-right: 0;
                }
            }

            .detailToupiaoBtn{
                width: 75px;
                text-align: center;
                color: #fff;
                cursor: pointer;
                border:0;
                height: 32px;
                line-height: 32px;
                float: right;
                border-radius: 3px;
                font-size: 16px;
                background: #c40000;
                &.voted{
                    background: #999;
                    color: #eee;
                }

            }
        }
     }

     .detail-acticle{
         margin-top:12px;
         line-height: 24px;
         font-size: 16px!important;
         img{
            margin-top:24px; 
            margin-bottom: 5px;
            width: 49.1525%;
            & + img{
                float: right;
            }
             
         }
         p{ line-height: 1.5!important;
            margin:7px 0!important;
            text-align: justify!important;
            text-indent: 2em!important;
            font-family: '宋体'!important;
            font-size: 16px!important;
            img{
                text-indent: 0!important;
                display: block;
            }
            span{
                font-family: '宋体'!important;
                font-size: 16px!important;
            }

        }

     }
     .errorBox{
         position: absolute;
         top:40%;
         left: 50%;
         transform: translate(-50%,-50%);
         text-align: center;
         font-size: 20px;
         i{
             display: block;
             font-size: 50px;
         }
     }
 }

 //登陆框
 .coverbg{
    position: fixed;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: 99;

 }
 .loginContainer{
     width: 360px;
     min-height: 308px;
     box-sizing: border-box;
     border:1px solid #979797;
     border-radius: 6px;
     background: #fff;
     position: fixed;
     top:50%;
     left: 50%;
     transform: translate(-50%,-50%);
     z-index: 100;
     padding:17px 23px;
     h2{height: 40px; line-height: 40px; font-weight: normal; font-size:18px; }
     .closeLogin{
        position: absolute;
        width: 22px;
        height: 22px;
        top:26px;
        right: 20px;
        font-size: 22px;
        text-align: center;
        line-height: 22px;
        cursor: pointer;
        &:hover{
            color: red;
        }

     }
     .loginIpt{
        border-bottom: 1px solid #d8d8d8;
        height: 50px;
        line-height: 50px;
        margin-top:23px;
        box-sizing: border-box;
        position: relative;
        label{ width: 64px; float: left;}
        .ipt{ width: 150px;
               float: left;
               height: 32px;
               line-height: 32px;
               margin-top:9px;
               border:0;
               font-size: 16px;
            }
        .yzpic{
            width: 85px;
            height: 32px;
            float: right;
            border:1px solid #ccc;
            border-radius: 2px;
            box-sizing: border-box;
            margin-top:4px;
            vertical-align: middle;
        }
        .timeCount{
                width: 85px; 
                height: 28px;
                line-height: 28px; 
                text-align: center; 
                background: #617b9d;
                color: #fff;
                display: block;
                float: right;
                margin-top:11px;
                border-radius: 2px;
                border: 0;
                cursor: pointer;
                &.disabled{
                    background: #eee;
                    color: #999;
                }
                
            }     
        p{
            position: absolute;
            height: 20px;
            line-height: 20px;
            bottom: -22px;
            left: 0;
            right: 0;  
            .error{
                color: red;
            }          
            .success{
                color: #2fba62;
            }
            
            
            i{margin-right: 3px;}
        }
    }
    .loginBtn{
        width: 100%;
        height: 52px;
        cursor: pointer;
        background: #c40000;
        border:0;
        border-radius: 6px;
        font-size: 18px;
        color: #fff;
        margin-top: 36px;
        &:active{
            background: #9f0101;
        }
        &.disabled{
            background: #eee;
            color: #666;
        }
    }
 }

 //投票成功
 .toupiao{
     height: 48px;
     line-height: 48px;
     text-align: center;
     font-size: 15px;
     position: fixed;
     top:50%;
     left: 50%;
     transform: translate(-50%,-50%);
     z-index: 102;
     background: #fff;
     border-radius: 6px;
     box-shadow: 1px 1px 3px #666;
     min-width: 180px;
     padding:0 15px;
     white-space: nowrap;
     overflow: hidden;
     i{
         font-size: 22px;
         margin-right: 10px;
         vertical-align: middle;
     }
     span{
         vertical-align: middle;
     }
     &.success{         
         i{
             color: #2fba62;
         }
     }
     &.error{        
        i{
            color: #c70909;
        }
     }
 }




 // < 1280
 @media screen and (max-width: 1280px) {
    .content{
        padding: 0 30px;
    }
    .detailContent{
        padding: 0 24px;
    }
}


 // 适配pad和手机端
@media screen and (max-width: 767px) {

    #page{       
        &.hasbg{
            background: #7e0a0f url(../images/body_bg_phone2.jpg) no-repeat center 0px;
            background-size:100% auto; 
            min-height: 1528px;
            padding-top:44px;
        }
    }

    //头部
    .header{
     
        .logo{        
            h1{
                width: 118px; 
                height: 48px; 
                background: url(../images/logo.png) no-repeat;
                background-size:118px 48px;   
            }
            a{            
               
            }
        }
    } 
    .zhanweifu{
        width: 100%;
        display: block;
        visibility: hidden;
    }
    .pingxuan_res1box{
        margin: 0 auto 0;
    }

    .pingxuan_res1box{
        dl{
            dd{
                margin-left: 20px;
            }
        }
    }
    .pingxuan_res2box{
        .pingxuanTitle{
            b{
                display: none;
            }
        }
    }
    

    .pingxuan_res3box{
        h3{
            font-size: 18px;
        }
        dl{
            dd{
                margin-left: 24px;
                white-space: nowrap;
                &.white{
                    white-space:normal;
                    line-height: 1.4;
                    margin-top:10px;
                }
                &.normal{
                    white-space:normal;
                    line-height: 1.5;
                    
                }
            }
        }
    }
    //评选规则
    .rulebox{
        width: 100%;
        margin-top:50px;
        padding: 10px 30px;
        .ruletitle{
            font-weight: bold;
            font-size: 16px;
            line-height: 1.6;
            position: static;
            text-align: center;
            display: block;
        }

        .ruleContent{
            font-size: 14px;
            p{
                margin-bottom: 10px;
                text-indent: -12px;
            }
        }
    }
    .content{
        margin-top:20px;
        padding:0 10px;

    }

    .detailContent{         
        .detail-acticle{    
            font-size: 16px!important;       
            img{
               width: 100%!important;
               height: auto!important;
   
               & + img{
                   float: none;
               }
                
            }
            b,strong{
                font-weight: normal !important;
                font-size: 16px !important;
            }
            p{
                font-style:normal !important;    
                font-size: 16px !important;            
                font-family: "Helvetica Neue",Helvetica,Arial,"Microsoft Yahei","Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif !important;
                span{
                    font-size: 16px !important;
                }
            }
            span{
                font-size: 16px !important;
                span{font-size: 16px !important;}
            }
            
   
        }
    }

    .loginContainer{
        width: 320px;
        .loginIpt{
            label{
                width: 58px;
            }
            .ipt{
                width: 128px;
            }
        } 
    }
   
}

// 适配pad和手机端
@media screen and (max-width: 540px) {
    #page{
        // padding-top: 44px;
        &.hasbg {
            background: #7e0a0f url(../images/body_bg_phone2.jpg) no-repeat center 0px;
            background-size: 100% auto;
            .header{
                display: block;
            }
        }
    }
    //头部
    .header{
        height: 44px;
        .logo{        
            margin: 8px 0 0 10px;
            h1{
                width: 59px; 
                height: 24px; 
                background: url(../images/logo.png) no-repeat;
                background-size:auto 24px;   
                a{
                    height: 24px;                    
                }
            } 
            a{
                font-size: 12px;
                display: none;
            }
        }
        .user-info{
            line-height: 44px;
            a{
                font-size: 14px;
            }
        }
    }
    .content{
        padding: 0;
    }
    .phoneHidden{
        display: none;
    }
 }


